フォームにヘルプを表示する
フォームに使用するチェックボックスやラジオボタン、テキストボックスにヘルプを表示させることができれば、訪問者がより確実に入力を行えるようになります。今週は、フォームにヘルプを表示させる方法を紹介してみましょう。

→ チェックボックスにヘルプを表示する
 
フォームにヘルプを表示させるのに、わざわざJavaScriptを使用する必要はありません。INPUTタグにtltle属性を追加し、属性の値にヘルプの内容を記述するだけでOKです。なおヘルプの内容は、チェックボックス上にマウスポインタが来たとき、ポップアップで表示されます。
<INPUT type="checkbox" id="check1"
title="朝食はおにぎりとお味噌汁です。必要な方はチェックしてください。">
<LABEL for="check1">朝食</LABEL>

<INPUT type="checkbox" id="check2"
title="昼食はカレーライスです。必要な方はチェックしてください。">
<LABEL for="check2">昼食</LABEL>

<INPUT type="checkbox" id="check3"
title="夕食は豪華なバーベキューです。必要な方はチェックしてください。">
<LABEL for="check3">夕食</LABEL>


→ ラジオボタンにヘルプを表示する
 
同様の手順で、ラジオボタンにヘルプを追加することも可能です。もちろん、各INPUTタグにそれぞれtitle属性を追加することで、ラジオボタンひとつひとつに別のヘルプを表示させることも可能です。
<INPUT type="radio" name="color" id="radio1"
title="この色は当店のオリジナルカラーとなります。">
<LABEL for="radio1">赤</LABEL>

<BR>

<INPUT type="radio" name="color" id="radio2"
title="現在、最も人気のあるカラーです。いまなら在庫あります!">
<LABEL for="radio2">青</LABEL>

<BR>

<INPUT type="radio" name="color" id="radio3"
title="生産数が最も少ないレアカラーモデルです。">
<LABEL for="radio3">緑</LABEL>


→ テキストボックスにヘルプを表示する
 
こちらも手順的には同様で、INPUTタグにtitle属性を追加するだけです。1行だけのテキストボックス(INPUTタグでtype="text")と、複数行のテキストボックス(TEXTAREAタグ)の両方に使用することが可能です。入力すべき内容や注意事項などをヘルプとして記述しておくとよいでしょう。
メールアドレス:
<INPUT type="text" size="30"
title="メールアドレスの入力は確実にお願いします。">

<BR><BR>

感想<BR>
<TEXTAREA rows="8" cols="50"
title="感想の内容により抽選結果が左右されることはありません。思ったことをご自由に記述してください。"></TEXTAREA>

e[NECir Yahoo yV LINEf[^[z500~`I
z[y[W NWbgJ[h COiq@COsI COze